<template>
  <div class="layout-bodyContent">
    <div class="layout-breadcrumb">
      <Breadcrumb>
        <Breadcrumb-item href="#">应用管理</Breadcrumb-item>
        <Breadcrumb-item href="#">资源管理</Breadcrumb-item>
      </Breadcrumb>
    </div>
    <div class="layout-content">
      <div id="content"></div>
    </div>
  </div>
</template>

<script>
  let marked = require('marked');

  let markdownString ="> 例如这样";


  marked(markdownString, function (err, content) {
    if (err) throw err;
    console.log(content);
  });

  marked.setOptions({
    highlight: function (code) {
      return require('highlight.js').highlightAuto(code).value;
    }
  });

  export default{
    mounted(){
      this.createMarkdown();
    },
    methods: {
      createMarkdown(){
        document.getElementById('content').innerHTML =marked(markdownString);
      }
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style>

</style>
